<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>中止施工</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/lib/layui/css/layui.css">
    <link rel="stylesheet" href="/statics/layui/font/font.css" media="all"/>
    <link rel="stylesheet" href="/static/css/weadmin.css">
    <style type="text/css">
        html, body {
            height: 100%;
        }

        .chooseBox {
            border: 1px solid #333;
            height: 300px;
            padding: 10px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            overflow-y: auto;
        }

        .leftBox > p {
            line-height: 30px;
            padding-left: 20px;
            cursor: pointer;
        }

        .leftBox > p:hover {
            background: #ddd;
        }

        .leftBox > p.selected {
            background: #d5d5d5;
        }

        .hide {
            display: none;
        }
    </style>
</head>
<body>
<div class="layui-fluid" style="height:100%;">
    <form class="layui-form" lay-filter="formData" style="margin-top: 10px;">
        <input type="hidden" name="userId" class="formData">
        <input type="hidden" id="pauseId" name="id" class="formData">
        <input type="hidden" id="status" name="status" class="formData">
        <!--申请表单-->
        <div class="layui-collapse">
            <div class="layui-colla-item">
                <h2 class="layui-colla-title">申请表单</h2>
                <div class="layui-colla-content layui-show">
                    <table class="layui-table v-table">
                        <tbody>
                        <tr class="hide">
                            <td width="24%"></td>
                            <td width="13%"></td>
                            <td width="13%"></td>
                            <td width="24%"></td>
                            <td width="13%"></td>
                            <td width="13%"></td>
                        </tr>
                        <tr>
                            <td class="th8 required">项目名称</td>
                            <td colspan="5">
                                <input type="hidden" id="prjName" name="prjName" class="formData"/>
                                <select id="prjId" name="prjId" lay-filter="prjChange" class="layui-input formData" autocomplete="off">
                                    <option></option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td class="th8 required">中止施工时间</td>
                            <td colspan="5">
                                <input  name="pauseDate" id="pauseDate" lay-verify="" class="layui-input formData" placeholder="中止施工时间" autocomplete="off" readonly>
                            </td>
                        </tr>
                        <tr>
                            <td class="th8 required">中止施工原因</td>
                            <td colspan="5">
                                <input name="pauseReason" lay-verify="" class="layui-input formData" placeholder="中止施工原因" autocomplete="off">
                            </td>
                        </tr>
                        <tr>
                            <td class="th8 required">施工现状</td>
                            <td colspan="5">
                                <input name="situation" lay-verify="" class="layui-input formData" placeholder="施工现状" autocomplete="off">
                            </td>
                        </tr>
                        <tr>
                            <td class="th8 required">停工部位</td>
                            <td colspan="5">
                                <input name="pauseAreaName" lay-verify="required" class="layui-input formData" placeholder="停工部位" autocomplete="off">
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <!--中止施工相关文件-->
        <div class="layui-collapse">
            <div class="layui-colla-item">
                <h2 class="layui-colla-title">中止施工相关文件</h2>
                <div class="layui-colla-content layui-show">
                    <script type="text/html" id="toolbarOrg1">
                        <div class="layui-btn-container">
                            <input type="button" value="上传文件" class="layui-btn" lay-event="add" id="sqFileUpload" style="display:none">
                        </div>
                    </script>
                    <script type="text/html" id="delete1">
                        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="delete1">删除</a>
                        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="download1">下载</a>
                    </script>
                    <script type="text/html" id="delete2">
                        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="download1">下载</a>
                    </script>
                    <table class="layui-hide" id="dataList1" lay-filter="dataList1"></table>
                </div>
            </div>
        </div>

        <!--申请机构-->
        <div class="layui-collapse">
            <div class="layui-colla-item">
                <h2 class="layui-colla-title">申请机构</h2>
                <div class="layui-colla-content layui-show">
                    <table class="layui-table v-table">
                        <tbody>
                        <tr class="hide">
                            <td width="24%"></td>
                            <td width="13%"></td>
                            <td width="13%"></td>
                            <td width="24%"></td>
                            <td width="13%"></td>
                            <td width="13%"></td>
                        </tr>
                        <tr>
                            <td class="th8">申请单位</td>
                            <td colspan="5">
                                <input type="text" id="buildCorpName" name="buildCorpName" placeholder="申请单位" autocomplete="off" class="layui-input formData" disabled>
                            </td>
                        </tr>
                        <tr>
                            <td class="th8">提交人</td>
                            <td colspan="5">
                                <input type="text" id="createUserName" name="createUserName" placeholder="提交人" autocomplete="off" class="layui-input formData" disabled>
                            </td>
                        </tr>
                        <tr>
                            <td class="th8">申请日期</td>
                            <td colspan="5">
                                <input type="text" id="createTime" name="createTime" placeholder="申请日期" autocomplete="off" class="layui-input formData" disabled>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        <!--审批意见-->
        <div class="layui-collapse" id="sp" style="display:none">
            <div class="layui-colla-item">
                <h2 class="layui-colla-title">审批意见</h2>
                <div class="layui-colla-content layui-show">
                    <table class="layui-table v-table">
                        <tbody>
                        <tr class="hide">
                            <td width="24%"></td>
                            <td width="13%"></td>
                            <td width="13%"></td>
                            <td width="24%"></td>
                            <td width="13%"></td>
                            <td width="13%"></td>
                        </tr>
                        <tr>
                            <td class="th8">同意中止施工日期</td>
                            <td colspan="5">
                                <input type="text" id="consentPauseDate" name="consentPauseDate" placeholder="同意中止施工日期" autocomplete="off" class="layui-input formData" disabled>
                            </td>
                        </tr>
                        <tr>
                            <td class="th8">驳回原因</td>
                            <td colspan="5">
                                <input type="text" id="rejectReason" name="rejectReason" placeholder="驳回原因" autocomplete="off" class="layui-input formData" disabled>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>


        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label required">项目名称：</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input type="hidden" id="prjName" name="prjName" class="formData"/>-->
                <!--<select id="prjId" name="prjId" lay-verify="required" class="formData" lay-filter="prjChange">-->
                    <!--<option></option>-->
                <!--</select>-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label required">中止施工时间</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input name="pauseDate" id="pauseDate" placeholder="中止施工时间" autocomplete="off" class="layui-input formData" lay-verify="required" readonly>-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label required">中止施工原因</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input type="text" name="pauseReason" lay-verify="required" placeholder="中止施工原因" autocomplete="off" class="layui-input formData">-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label required">施工现状</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input type="text" name="situation" lay-verify="required" placeholder="施工现状" autocomplete="off" class="layui-input formData">-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label required">停工部位</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input type="text" name="pauseAreaName" lay-verify="required" placeholder="停工部位" autocomplete="off" class="layui-input formData">-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label">相关文件</label>-->
            <!--<div class="layui-input-block">-->

            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label">申请单位</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input type="text" id="buildCorpName" name="buildCorpName" readonly placeholder="申请单位" autocomplete="off" class="layui-input formData" disabled>-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label">提交人</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input type="text" id="createUserName" name="createUserName" readonly placeholder="提交人" autocomplete="off" class="layui-input formData" disabled>-->
            <!--</div>-->
        <!--</div>-->

        <!--<div class="layui-form-item">-->
            <!--<label class="layui-form-label">提交时间</label>-->
            <!--<div class="layui-input-block">-->
                <!--<input type="text" id="createTime" name="createTime" readonly placeholder="提交时间" autocomplete="off" class="layui-input formData" disabled>-->
            <!--</div>-->
        <!--</div>-->


    </form>
</div>
<script type="text/javascript" src="/lib/layui/layui.js"></script>
<script src="/static/js/main.js"></script>
<!--<script type="text/javascript" src="../../../statics/js/sys/editDict.js"  charset="utf-8"></script>-->
<script>
    layui.use(['form', 'sessionFun', 'configure', 'configureCom', 'laydate', 'jquery'], function () {
        window.$ = layui.$;
        var form = layui.form;
        var configure = layui.configure;
        var laydate = layui.laydate;
        var configureCom = layui.configureCom;
        var sessionFun = layui.sessionFun;
        var listData = sessionFun.get(configure.PAUSE_ROW_DATA);
        var token = sessionFun.get(configure.SESSION_TOKEN) ? sessionFun.get(configure.SESSION_TOKEN).token : '';
        var table = layui.table;
        //待办项页面加载详情时会有pauseId
        var pauseId = sessionFun.get('pauseId');
        var prjId = '';
        //用于操作中止施工申请附件
        var id = '';
        //申请状态, 用于过滤文件删除按钮
        var status = '';

        laydate.render({
            elem: '#pauseDate'
        });

        laydate.render({
            elem: '#createTime',
            type: 'date'
        });

        //详情或修改页面
        if (listData) {
            form.val('formData', listData);
            id = listData.id;
            status = listData.status;
            //驳回和同意状态 显示审配相关内容
            if(listData.status==2 || listData.status==3){
                $("#sp").css("display","");
            }
        //待办项加载详情
        }else if(pauseId){
            var res;
            var data1 = $.extend({pauseId:pauseId}, {token: token});
            var index = top.layer.load(1, {shade: 0.01});
            $.ajax({
                url: configure.PAUSE_DETAIL_INFO,
                type: 'get',
                cache: false,
                async:false,
                headers: {
                    'Authorization': token
                },
                data: data1,
                dataType: 'json',
                success: function (data) {
                    top.layer.close(index);
                    res = data;
                },
                error: function (data) {
                    top.layer.close(index);
                }
            });
//            var res = configureCom.getAjax(configure.PAUSE_DETAIL_INFO, {pauseId:pauseId}, false);
            if(!res.data){
                res.data = { id: pauseId};
            }
            prjId = res.data.prjId;
            form.val('formData', res.data);
            id = res.data.id;
            status = res.data.status;
        //发起中止施工申请
        }else{
            id = guid();
            $("#pauseId").val(id);
        };
        form.render();


        /**
         * 中止施工相关文件 列表
         */
        var table2 = {
            id:'dataList1',
            cols: fileListBtn(),
            url:configure.SYS_DOC_ATTS_API,
            data:{
                businessId:id,
                code:'PRJ_PAUSE_FILES'
            },
            page:false
        };
        console.log(table2);

        configureCom.tableRenderGet(table2.url, table2.data, table2.cols, table2.id, 10, '', 'toolbarOrg1',table2.page);

        //未提交和驳回状态 显示上传按钮
        if (status==0){
                $("#sqFileUpload").css("display","");
        }

        //头工具栏事件
        table.on('toolbar(dataList1)', function (obj) {
            switch (obj.event) {
                case 'add':
                    sessionFun.set(configure.SESSION_UPLOAD_CONFIG,{
                        url:configure.COMMON_UPLOAD_API,
                        formData:{
                            businessId:id,
                            code:'PRJ_PAUSE_FILES'
                        },
//                        accept:{
//                            title: '文件上传',
//                            extensions: 'gif, jpg, jpeg, bmp, png, dwg, txt, doc, docx, xls, xlsx, ppt, pptx, pdf',
//                            mimeTypes: '.dwg'
//                        }
                        accept:{
                            title: '文件上传',
                            extensions: 'gif,jpg,jpeg,bmp,png,dwg,doc,docx,xls,xlsx,ppt,pptx,pdf',
                            mimeTypes: 'image/*,application/pdf' +
                            'application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,' +
                            'application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,' +
                            'application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation,'
                        }
                    });
                    top.layer.open({
                        type: 2,
                        title: '上传附件',
                        content: configure.COMMON_UPLOAD_HTML,
                        area: configureCom.Psize1,
                        cancel: function (index, layero) {
                            configureCom.tableReloadById(table2.id);
                            //驳回和同意状态 显示审批相关内容
                            if (status==0 || status==2){
                                $("#sqFileUpload").css("display","");
                            }
                        }
                    });
                    break;
                case 'delete1':
                    alert("删除文件");
                    break;
            }
        });

        //每行操作
        table.on('tool(dataList1)', function (obj) {
            var data = obj.data;
            if (obj.event === 'delete1') {
                //删除文件
                $.ajax({
                    type: "POST",
                    url: configure.COMMON_FILE_DELETE_API+'?token='+token,
                    data: {
                        "attIds" : data.id
                    },
                    success: function (data) {
                        var code = data.code;
                        var msg = data.msg;
                        if (code == "0" || msg == "success") {

                        } else {
                            layer.msg(data.msg);
                        }
                        layer.closeAll('loading');
                        //页面刷新
                        configureCom.tableReloadById(table2.id);
                    }
                });
            }else if(obj.event === 'download1'){
                window.open(configure.COMMON_FILE_DOWNLOAD_API+'/'+data.id+'?token='+token)
            }
        });


        form.on('select(prjChange)', function(data) {
            var prjName = $(data.elem).find("option:selected").text(); //得到被选中的text
            $("#prjName").val(prjName);
        });

        //加载已分配项目列表
        $.ajax({
            type: "POST",
            url: configure.RPJ_ASSIGN_LIST_HTTP+'?token='+token,
            data: {},
            success: function (data) {
                var code = data.code;
                var msg = data.msg;
                if (code == "0" || msg == "success") {
                    var records = data.page.records;
                    if(records && records.length>0){
                        //遍历下拉查询返回值，并拼接到下拉框内
                        $.each(records, function(idx, obj) {
                            $("#prjId").append('<option value="'+obj.prjId+'">'+obj.prjName+'</option>');
                        });
                        if (listData) {
                            $('#prjId').val(listData.prjId);
                        }else if(pauseId){
                            $('#prjId').val(prjId);
                        }
                        //重新渲染form表单  否则动态option不生效
                        form.render('select');
                    }
                } else {
                    layer.msg(data.msg);
                }
                layer.closeAll('loading');
            }
        });

        //查询当前登录用户
        $.ajax({
            type: "POST",
            url: configure.USER_CURRENT_API+'?token='+token,
            data: {},
            success: function (data) {
                var code = data.code;
                var msg = data.msg;
                if (code == "0" || msg == "success") {
                    var user = data.user;
                    if(user){
                        $("#createUserName").val(user.realName);
                    }
                    var org = data.org;
                    if(org){
                        $("#buildCorpName").val(org.orgName);
                    }
                    var date = new Date();
                    var year = date.getFullYear(); //获取完整的年份(4位)
                    var month = date.getMonth(); //获取当前月份(0-11,0代表1月)
                    var date = date.getDate(); //获取当前日(1-31)
                    $("#createTime").val(year+'-'+(month+1)+'-'+date);
                } else {
                    layer.msg(data.msg);
                }
                layer.closeAll('loading');
            }
        });

        function fileListBtn(){
            //只有未申请状态才可以继续操作文件
            if(0==status){
                return [[
                    {field: 'name', title: '文件名称'},
                    {fixed: 'right', title: '操作', toolbar: '#delete1', width: 320}
                ]];
            }else{
                return [[
                    {field: 'name', title: '文件名称'},
                    {fixed: 'right', title: '操作', toolbar: '#delete2', width: 320}
                ]];
            }
        }

    });

    function getData() {
        return new Promise(function (res, rej) {
            var data = {};
            if (!window.formVerifyFun()) {
                //return false;
            }

            $('.formData').each(function (index, item) {
                var key = $(item).attr('name');
                data[key] = $(item).val();
            });
            res({result: data});
        });
    }

    function guid() {
        uid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
            var r = Math.random()*16|0, v = c == 'x' ? r : (r&0x3|0x8);
            return v.toString(16);
        });
        return uid.replace(/-/g,'');
    };
</script>
</body>
</html>
